<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" href="${ctx}/js/ext-3.3.0/resources/css/ext-all.css"/>
<link href="${ctx}/css/hiddenwin.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="${ctx}/js/ext-3.3.0/ext-base.js"></script>
<script type="text/javascript" src="${ctx}/js/ext-3.3.0/ext-all.js"></script>
<script type="text/javascript" src="${ctx}/js/ext-3.3.0/ext-lang-zh_CN.js"></script>
<script type="text/javascript" src="${ctx}/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="${ctx}/js/ajaxfileupload.js"></script>
<script type="text/javascript" src="${ctx}/js/common.js"></script>
<title>文件管理</title>
 <style>
	    	body {
	    		background-color:RGB(245,244,249);
	    	}
			.x-panel-header-new{
			height:60px;
			background:#CDDEF3;
			padding:7px 0 0 10px;
		}
		.new-search-wrap{
			width:170px;
			height:47px;
			border:2px solid #9EBFDB;
			border-radius:5px;
			box-shadow:1px 1px 0 #ffffff;
			float:left;
			padding:2px 0 2px 6px;
		}
		.x-panel-header-new label{
			font-size:12px;
			color:#14428B;
			font-weight:bold;
			margin:0;
			padding:0;
			
		}
		.new-select-city{
			padding:0;
			width:68px;
			height:44px;
			display:inline-block;
			border-right:1px dotted #99BBE8;
			box-shadow:1px 0 0 #ffffff;
		}
		.new-select-city select{
			width:60px;
			height:26px;
			border:1px solid #7F9DB9;
			margin-top:2px;
		}
		.new-select-name{
			width:92px;
			height:44px;
			display:inline-block;
			border-right:1px solid #99BBE8;
		}
		.new-select-name input{
			height:22px;
			width:76px;
			padding-left:6px;
			border:1px solid #7F9DB9;
			margin-top:2px;
		}
		.new-select-data{
			border-right:1px solid #99BBE8;
			box-shadow:none;
		}
		.new-search-button{
			display:inline-block;
			width:50px;
			height:44px;
			margin-top:-10px;
			text-align: center;
		}
		.new-search-button input{
			background:url(../images/search.png) no-repeat;
			width:36px;
			height:25px;
			padding:0;
			margin:0;
			border:0;
			margin-top:2px;
		}
		.new-search-delete{
			width:50px;
			height:48px;
			border:2px solid #9EBFDB;
			border-radius:5px;
			box-shadow:1px 1px 0 #ffffff;
			display:inline-block;
			float:left;
			margin-left:5px;
			text-align: center;
			padding-top:3px;
			
		}
		.new-search-delete input{
			width:36px;
			height:25px;
			padding:0;
			margin:0;
			border:0;
		}
		.new-search-btn{
			background:url(../images/delete_new.png) no-repeat;
		}
		.new-search-download{
			background:url(../images/download.png) no-repeat;
		}
		.new-search-add{
			background:url(../images/add_new.png) no-repeat;
		}
	    </style>
<#include '/setting.ftl'>
<script type="text/javascript">
    var previewPrefix = '${previewPrefix}';
	var createuser = '${SESSION_USER.userName!}';
	var ctx = '${ctx}';
	var store = null;
var fields =  [ 'id','keyword','createUser','createDateString','isValid'];
var columns = "";
var condition = "";
var grid ;
var myMask;
var win;
function showMessage(title,desc){
		   Ext.Msg.alert(title,desc);
} 

var currentEdit;
var editRecord;
Ext.onReady(function(){
	   store = new Ext.data.Store( 
	     	{
		       	proxy:new Ext.data.HttpProxy({
		       	url: ctx+'/smgkeyword/getpagedata'  
		       }),
	       reader:new Ext.data.JsonReader({
	           root:"root",  
	           totalProperty: 'count',
	           fields:fields
	         }),
	         pruneModifiedRecords:true
	     });
	     
	   var bbar= new Ext.PagingToolbar({
	        pageSize: 25,
	        store: store,
	        loadMask: this.LoadMask,
	        displayInfo: true,
	        displayMsg: '当前为第[{0}]</span>条至第[{1}]条数据，共[{2}]条数据',
	        emptyMsg: "没有数据"   
	    });
	    var sm = new Ext.grid.CheckboxSelectionModel();
	    var cm = new Ext.grid.ColumnModel([
	    	sm,
		   	  {header: "id", width: 20, sortable: true, dataIndex: 'id',sortable:true},      
	          {header: "关键字", width: 170, sortable: true, dataIndex: 'keyword',sortable:true
			  },     
	          {header: "创建者", width: 80, sortable: true, dataIndex: 'createUser',sortable:true},
			  {header: "创建日期", width: 100, sortable: true, dataIndex: 'createDateString',sortable:true},
	          {header: "是否有效", width: 40, sortable: true, dataIndex: 'isValid',sortable:true,renderer:function(value){
	          			if ( value == 1 ){
	          				return "<font color='green'>有效</font>";
	          			}else{
	          				return "<font color='red'>无效</font>";
	          			}
	          	
	          }}
	    ]);
	    
	   var clickFlag = false;
	    	//定义加载数据遮罩层
	   myMask = new Ext.LoadMask(Ext.getBody(), {msg:"加载数据中,请等待......",store:store,removeMask :true});
	   var submitFlag = false;
	    // define grid start
	     grid = new Ext.grid.EditorGridPanel({
	    	 id:'grid', 
	    	layout : 'fit',
	    	// 自动适应宽高
	        autoWidth:true,
	    	autoHeight : true,
	    	sm:sm,
	        width:document.body.clientWidth,  
	        height: document.body.clientHeight,  
	    	maskText : '正在加载中...',
	     	getLoadMask : function(){
	         	if(this.LoadMask){
	          		return this.LoadMask;
	         	}else{
	          		this.LoadMask = new Ext.LoadMask(Ext.getBody(),{msg:this.maskText,removeMask : true});
	          		return this.LoadMask;
	         	}
	        },
	         setMaskText : function(msg){
	        	this.maskText = msg;
	        	this.getLoadMask().msg = this.maskText;
	        },
	      	store:store, 
	      	      // 每次只能选择一行
	   		title: "关键字列表",
	         cm:cm,
			 bbar:bbar,
	         viewConfig:{
	          	forceFit: true
	         },tbar:[
	         ]
	    });
			store.on('beforeload',function( store , options ){
          	store.baseParams = {
	          	isValid:$("#isValid").val(),
				keyword:$('#keyword').val()
          	};  
			}); 
		  store.load(  {  params:{start:0,limit:25} }  );
		  grid.render("infoDiv");
	      	 
});
function newkeyword(){
	if(!win){
				win = new Ext.Window({
					el:'hello-win',
					title:"新增关键字",
					layout:'fit',
					width:500,
					height:130,
					hidden:true,
					resizable:false,
					closeAction:'hide',
					plain: true,
					contentEl : "nleft",
			        buttons: [{
						        text:'保存',
						        handler:  function(){
						        	update();
			                    }
						    },
						    {
					            text: '取消', 
								handler: function(){
			                        win.hide();
			                    }
							}]
				});
			}
		win.show();
			
}
function update(){
	if ( 
		 checkInputValueForShow("keyWords",1000,"string",true,false) 
	)	{
		setWinMaskShow(win);
		$.ajaxFileUpload({
			url : "${ctx}/smgkeyword/importbyfile",
			secureuri:false,
			data:{
				maxSize:5,
				keyWords:$('#keyWords').val()
 			},
			type:"post",
			dataType:'json',
			fileElementId:"filename",
			success: function (data, status){
				if ( data.state == "1" ){
					Ext.Msg.alert('新增成功',data.desc);
				}else{
					Ext.Msg.alert('新增失败',data.desc);
				}
					setWinMaskHide(win);
					win.hide();
					store.reload();
					$('#keyWords').val("");
				
			},
			error: function (data, status, e){
				Ext.Msg.alert('修改失败,服务器内部错误',e);
				setWinMaskHide(win);
			}
		});
	}
	
}
function updateIsValid(isValid){
	var desc = "";
	if ( isValid == 1){
		desc = "恢复";
	}else{
	    desc = "删除";
	}
	var ids = getSelectedIds("grid","id");
	if ( ids != "" ){
		if ( confirm("确认"+desc+"?")){
		Ext.lib.Ajax.request('POST', '${ctx}/smgkeyword/update', {
				success: function(response){
					Ext.Msg.alert('操作成功',"操作成功");
					store.reload();
				},
				failure: function(){
					Ext.Msg.alert('操作失败,服务器内部错误');
				}
			},
			'isValid='+isValid+"&ids="+ids
			);
	}}
}
function query(){
	store.load({params:{
			isValid:$("#isValid").val(),
			keyword:$('#keyword').val()
	}})
}
</script>
</head>
<body>
	<div class="x-panel-header-new">
		<div class="new-search-wrap"style="width:350px;">
			<span class="new-select-city">
				<label for="">状态选择</label>
				<select id='isValid'>
					<option value="">全部</option>
					<option value="1">有效</option>
					<option value="0">无效</option>
				</select>
			</span>
			<span class="new-select-name">
				<label for="">查询关键字</label>
				<input type="text" name="keyword" id="keyword">
			</span>
			<span class="new-search-button"><label for="">查询</label><input type="text"  style="cursor:pointer" readonly="true" value="" onclick='query();' /></span>
			<span class="new-search-city">
				<input type='button' value='删除' style='color:red;width:50px;height:28px;cursor:pointer' onclick='updateIsValid(0)'>
				<input type='button' value='恢复' style='color:green;width:50px;height:28px;cursor:pointer' onclick='updateIsValid(1)'>
			</span>
		</div>
		<span class="new-search-delete"><label for="">新增</label><input type="button" value="" onclick="newkeyword();" style="cursor:pointer" class="new-search-add"></span>
		<!--
		<span class="new-search-delete">
			<label for="" style="margin-bottom:2px">下载</label><input type="button"  style="cursor:pointer" class="new-search-download"  onclick="downloadExcel()" />
		</span>-->
	</div>
		<div id="infoDiv" style="margin-top:10px;"></div>
		<!-- 编辑的表单-->
		<div id="hello-win" class="x-hidden">
			<div id="nleft" class="nleft" style="background: white;">
				<table width="482" border="0" cellpadding="0" cellspacing="0">
					<tbody>
						<tr bgcolor="#ECF1FA">
							<td width="150" height="30" align="center">上传文件</td>
							<!--var fields =  [ 'id','imagepath','imagetitle','groupName','groupLink','link','showorder','state']; -->
							<td   style="padding-left:3px;">
								<span id="uploadSpan" style="float:left;margin-top:15px;">
									<input type="file" ContentEditable="false" name="filename" id="filename">
								</span>
								</div>
							</td>
						</tr>
						<tr>
							<td width="150" height="30" align="center"><span>手动输入<br>(多个关键字以 , 隔开)</span></td>
							<td align="center"><input type="text"style='width:250px;'  id="keyWords" name="keyWords"/></td>
						</tr>
				    </tbody>
				  </table>
			</div>
		</div>	  		
</body>
</html>